@charset 'utf-8';
@import '../css/reset.css';

@function r($px){
    @return ($px / 100)*1rem;
}
@function half($px){
    @return ($px / 2)*1px;
}

header{
    padding: half(50) half(24) 0;
    position: fixed;
    width: 100%;
    height: half(120);
    top: 0;
    // background: wheat;

    .back{
        font-size: 0;
        button{
            width: half(123);
            height: half(54);
            border: 1px solid #ff9344;
            border-radius: half(20);
            background: transparent;
            font-size: half(26);
        }
    }
    .dizhi{
        font-size: 0;
        img{
            width: half(51);
            height: half(51);
        }
    }
    .fenlei{
        font-size: half(26);
        text-align: center;
       p{
           line-height: half(54);
       }
    }

}
#main{
    position: fixed;
    width:100%;
    top: half(120);
    bottom: half(136);
    // background:skyblue;
    overflow-y: scroll;
    overflow-x: hidden;
    .header{
        width: r(705);
        height: r(260);
        margin: 0 auto;
        img{
            width: 100%;
            height: 100%;
        }
    }
    .nav{
        width: 100%;
        height: r(135);
        padding: 0 r(46);
        p{
            font-size: r(72);
            color: #ff9344;
            line-height: r(135);
        }
        button{
            border: 0;
            width: r(110);
            height: r(60);
            font-size: r(30);
            color: white;
            background: #ff9344;
            border-radius: half(20);
           margin-top: r(38);
        }
    }
    .haop{
        width: 100%;
        padding: 0 r(46);
        font-size: 0;
        margin-bottom: r(38);
        div{
            img{
                width: r(36);
                height: r(36);
                margin-right: r(10);
            }
            span{
                font-size: r(30);
            }
            span:last-of-type{
                color: #ff9344;
            }
        }
        p{
            font-size: r(30);
            color: #aeaeae;
        }
    }
    .sysh{
        margin: 0 r(46);
        background: #ff9344;
        p{
            font-size: r(30);
            color: white;
            line-height: r(67);
            margin: 0 r(8);
        }
        p:last-of-type{
            font-size: r(47);
        }
    }
    .wsss{
        width: 100%;
        padding: 0 r(46);
        ul{
            width: 100%;
            li{
                position: relative;
                margin-top: r(10);
                img{
                    width: r(176);
                    height: r(176);
                }
                div{
                    margin-left: r(25);
                    font-size: r(24);
                    color: #aeaeae;
                    p{
                        line-height: r(40);
                        img{
                            width: r(35);
                            height: r(35);
                            line-height: r(35);
                        }
                        a{
                            font-size: r(24);
                            color: #ff9344;
                            line-height: r(43);
                        }
                    }
                    p:first-of-type{
                        font-size: r(30);
                        color: black;
                        line-height: r(55);
                    }
                }
                button{
                    border: 0;
                    border-radius: half(20);
                    width: r(110);
                    height: r(60);
                    font-size: r(30);
                    color: white;
                    background: #ff9344;
                    position: absolute;
                    right: 0;
                    top: 50%;
                    margin-top: r(-30);
                }
            }
        }
    }
}


footer{
    position: fixed;
    width:100%;
    height: half(136);
    bottom: 0;
    // background: blue;
    ul{
        width: 100%;
        height: 100%;
        font-size: 0;
        li{
            height: 100%;
            width: 25%;
            text-align: center;
            font-size: half(30);
            img{
                width: half(70);
                height: half(70);
                padding-top: half(10);
            }
        }
    }
}
